Web 应用开发

1. 20 道选择题，范围为作业范围，选择填空都出成选择题（40 分）

2. 程序填空题，10 个空（20 分）（ JDBC (重点)、Ajax (重点)，HTML 不出空）

   1.
   @ WebServlet ("/query")
   public class QueryServlet extends    HttpServlet      {
       protected void doPost(HttpServletRequest  req, HttpServletResponse resp) {
           // 1. 注册驱动
           Class. forName ("com.mysql.cj.jdbc.Driver");
           // 2. 连接
           String url = "jdbc:mysql://127.0.0.1:3306/school?useSSL=true";
           Connection conn = DriverManager.getConnection(url,"root","123456");
           // 3. 写 SQL
           String sql = "SELECT * FROM t_user";
           // 4. 执行 SQL
           Statement stmt = conn.createStatement();
           ResultSet rs = stmt.executeQuery (sql);
   		// 5. 关闭资源
   		rs.close(); stmt.close(); conn.close();
   		PrintWriter wr = resp.getWriter ();   wr.println("success");
       }
   }
   
   2.
   <form name="loginForm" action="LoginServlet" method="post">
       <p>user name: <input type="text" name="user" value=""/></p>
       <p>password: <input type="password" name="pwd" value=""/></p>
       <input type="submit" name="login" value="Login"/>
   </form>
   
   @ WebServlet("/LoginServlet ")
   public class LoginServlet extends HttpServlet{
       protected void doPost(HttpServletRequest  req, HttpServletResponse resp) throws ServletException, IOException {
           String user = req.getParameter("user");
           String password = req.getParameter("pwd");
           Class.forName("com.mysql.cj.jdbc.Driver");
           String url = "jdbc://127.0.0.1:3306/school?useSSL=true";
           Connection conn = DriverManager.getConnection(url,"root","123456");
           String sql = "SELECT * FROM t_user where username=? and password=?";
           PreparedStatement stmt = conn.prepareStatement (sql);
           stmt.setString(1,user);        stmt.setString(2, password);
           ResultSet rs = stmt.executeQuery();
   	if (rs.next()) request.setAttribute("result", "success");
   	else request.setAttribute("result", "fail");
           RequestDispatcher disp = req.getRequestDispatcher("/result.jsp");
           dispatcher.forward(request,response);
       }
   }
   
   
   3.
   <script type="text/javascript">
   $("#btn ").click (function () {
           $.ajax({ 
               url:"query", // 请求地址 
               data:$("#queryForm").serialize() , // 请求数据
               type: 'post',  // 请求方式
               dataType: ' json', // 结果返回类型
               success :function (data) { alert("button"); }
           });
       });
   </script>
   
   4.
   <form id="loginForm">
   <p>用户名: <input type="text" id="userName" name="userName" /></p>
   <p>密码: <input type="password" id="password" name="password" /></p>
   <input type="button" name="btn_login" value="登录"/>
   </form>
   <script type="text/javascript">
   $("#·btn_login").click(function () {
           $.ajax({
    		   url :"user/login",
    		   data:$("#loginForm").serialize(),
    		   type: 'post',
    			 dataType: 'json',
    			success:function (json) {
    			   if(json.code=="success")	
    				   window.location.href  ="product.html";
    			   else
    				 alert("登录失败");
    		   }
           });
       });
       </script>

3. 简答题 4 道（一个五分，以下4个出3个 20 分）

   5. pom.xml中引用组件的写法（考一个）
   <dependency>
     <groupId>mysql</groupId>
     <artifactId>mysql-connector-java</artifactId>
     <version>8.0.13</version>
     <scope>runtime</scope>
   </dependency>
   
   <dependency>
   	<groupId>javax.servlet</groupId>
   	<artifactId>javax.servlet-api</artifactId>
   	<version>3.0.1</version>
   	<scope>provided</scope>
   </dependency>
   
   6. VUE和React两种前端框架的特点对比：
   vue前端框架特点：
   渐进式框架：可逐步引入，从简单的视图层库到完整框架；
   模板语法友好：使用类似 HTML 的模板语法，学习曲线平缓；
   响应式数据绑定：基于 Proxy 的自动依赖追踪，数据变化自动更新视图；
   单文件组件：将模板、逻辑、样式集中在 .vue 文件中
   
   React 的特点
   声明式 UI：通过 JSX 声明组件结构，UI 随状态变化；
   组件化思想：组件复用性强；
   单向数据流：数据从上向下传递，状态可预测；
   函数式编程：Hooks 让函数组件拥有状态和生命周期
   
   7.MVC框架将应用分为三个核心组件：
   模型（Model）：负责业务逻辑与数据操作，封装数据规则并与数据库交互。它不依赖视图和控制器。
   视图（View）：负责用户界面展示，接收模型数据生成HTML/JSON等输出。视图不处理业务逻辑。
   控制器（Controller）：接收用户请求，调用模型处理业务，再选择合适的视图进行响应。
   相互关系：控制器接收请求 → 调用模型获取或修改数据 → 将数据传递给视图 → 视图渲染结果返回给用户。模型变化时通常会通知视图更新（观察者模式）。三者分离降低了耦合，提高可维护性。
   
   8. 5种JSP内置对象及其作用域
   request
   作用域：Request（一次请求，可经转发传递）
   封装客户端请求数据（参数、头、属性等）。
   
   response
   作用域：Page（仅当前页面响应）
   封装服务器对客户端的响应操作（如重定向、设置头信息）。
   
   session
   作用域：Session（同一用户多个请求期间）
   存储特定用户会话期间的私有数据（如登录信息）。
   
   application
   作用域：Application（整个 Web 应用，所有用户共享）
   存储全局数据（如计数器、配置参数），对应 ServletContext。
   
   pageContext
   作用域：Page（仅当前 JSP 页面）
   代表页面运行环境，可获取其他所有内置对象，并能将数据存储到 page、request、session、

4. 编程题（20 分）

   import java.io.IOException;
   import javax.servlet.*;
   import javax.servlet.annotation.WebFilter;
   
   @WebFilter("/*")
   public class EncodingFilter implements Filter 
   {
   	public void init(FilterConfig config) throws ServletException {}
   	public void destroy() {}
   	
   	public void doFilter(ServletRequest request, ServletResponse response,
   			FilterChain chain) throws IOException, ServletException 
   	{
   		String servletPath = httpRequest.getServletPath();
   		if (servletPath.endsWith(".jsp"))
   		{
   			request.setCharacterEncoding("UTF-8");
   			chain.doFilter(request, response);
   		}
   	}
   }

   10.
   Controller，Service（接口和实现），DAO（基于JPARepository），Entity 保存数据的实现过程
   (1) Controller
   @RestController  
    @RequestMapping("/person")  
    public class PersonController {  
      
        @Autowired  
        private PersonService personService;  
      
        @PostMapping("/save")  
        public MvcResult<Person> save(@RequestBody Person person) {  
            return personService.save(person);  
        }  
    }
   
   (2) Service 接口及实现
   public interface PersonService {  
        MvcResult<Person> save(Person person);  
    }
   
   @Service  
    public class PersonServiceImpl implements PersonService {  
      
        @Autowired  
        private PersonDao personDao;  
      
        @Override  
        public MvcResult<Person> save(Person person) {  
            personDao.save(person);  
            return MvcResult.success(person);  
        }  
    }
   
   (3) DAO  
    @Repository  
    public interface PersonDao extends JpaRepository<Person, Integer> {  
    }
    
    (4) Entity
    @Entity  
    @Table(name = "t_person")  
    public class Person {  
      
        @Id  
        @GeneratedValue(strategy = GenerationType.IDENTITY)  
        @Column(name="id")  
        private Integer id;  
      
        @Column(name = "name", nullable = false, length = 255)  
        private String name;  
        // getter、setter ...
    }